<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>02_DEMO</title>
</head>
<script type="text/javascript" src="../js/react.development.js"></script>
<script type="text/javascript" src="../js/react-dom.development.js"></script>
<script type="text/javascript" src="../js/babel.min.js"></script>
<body>
<h2>前端JS框架列表</h2>
<div id="example1"></div>
<script type="text/babel">
    /*
     功能: 动态展示列表数据
     */
    const names = ['jQuery', 'zepto', 'angular', 'react', 'vue'];

    const ul = (
        <ul>
            {names.map((name, index) => <li key={index}>{name}</li>)}
        </ul>)

    ReactDOM.render(ul, document.getElementById('example1'));
</script>

</body>
</html>
